import Vue from 'vue'
import VueRouter from 'vue-router'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

import Login from '@/views/Login'

// 正常写法
// import Layout from '@/views/Layout'
// import Home from '@/views/Home'
// import Publish from '@/views/Publish'
// import Article from '@/views/Article'

// 懒加载写法->跳转过去才加载这个文件
// /* webpackChunkName: "group-foo" */  --->文件名自定义注释
const Layout = () => import(/* webpackChunkName: "layout" */ '@/views/Layout')
const Home = () => import(/* webpackChunkName: "home" */ '@/views/Home')
const Publish = () => import(/* webpackChunkName: "publish" */ '@/views/Publish')
const Article = () => import(/* webpackChunkName: "article" */ '@/views/Article')

Vue.use(ElementUI)

Vue.use(VueRouter)

const routes = [{
  path: '/',
  redirect: '/layout' // 重定向去登录页
}, {
  // Login
  path: '/login',
  component: Login

}, {
  // Layout
  path: '/layout',
  component: Layout,
  // component: () => import('@/views/Layout')  //component第二种写法
  redirect: '/layout/home', // 重定向去首页
  children: [{
    // Home
    path: 'home',
    component: Home
  }, {
    // Publish
    path: 'publish',
    component: Publish
  }, {
    // Article
    path: 'article',
    component: Article
  }]
}]

const router = new VueRouter({
  routes
})

export default router
